<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>销售包表-柱状图</title>
    <script src="/js/plugins/echarts/echarts-all.js"></script>
    <script type="text/javascript">
        window.onload=function () {
            // 基于准备好的dom，初始化echarts图表
            var myChart = echarts.init(document.getElementById('main'));
            var option = {
                title:{
                    text:"销售报表",
                    x:'center',
                    subtext:"${groupName}"
                },
                tooltip: {
                    show: true
                },
                toolbox: {
                    show: true,
                    feature:{
                        mark:{
                            show:true
                        },
                        dataView:{
                            show:true,
                            readOnly:true
                        },
                        magicType:{
                            show:true,
                            type:['line','bar']
                        },restore:{
                            show:true
                        },
                        saveAsImage:{
                            show:true
                        }
                    },

                },
                legend: {
                    data:['销量'],
                    x:'left'
                },

                xAxis : [
                    {
                        type : 'category',
                        data : ${groupTypes}
                    }
                ],
                yAxis : [
                    {
                        type : 'value'
                    }
                ],
                series : [
                    {
                        "name":"销量",
                        "type":"bar",
                        "data":${totalAmounts},
                        markPoint:{
                            data:[{
                                type:'max',name:'最大值'
                            },{
                                type:'min',name:'最小值'
                            }]
                        },
                        markLine:{
                            data:[
                                {type:'average',name:'平均值'}
                            ]
                        }
                    }
                ]
            };
            // 为echarts对象加载数据
            myChart.setOption(option);
        }
    </script>
</head>
<body>
<div id="main" style="height:550px;width: 700px"></div>

</body>
</html>
